<!DOCTYPE html>
<html>
    <head>
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel='stylesheet' href='style.css' type='text/css'>
    </head>

    <body class="page" onbeforeunload="stop()" onunload="stop()">
        <div class="header toolbar">
            <div class="logo" alt="VTK PhylogeneticTree Web demo"></div>
            <div class="loading"></div>
        </div>
        <div class="viewport-container">
        </div>

        <script src="../../lib/core/vtkweb-loader-min.js" load="core-min"></script>
        <script type="text/javascript">
            var config = {
                sessionManagerURL: vtkWeb.properties.sessionManagerURL,
                name: "PhylogeneticTree",
                description: "PhylogeneticTree Web demo application",
                application: "phylotree",
                treeFile: "anolyis.phy",
                tableFile: "anolisDataAppended.csv"
            },
            loading = $(".loading"),
            viewport = null,
            stop = vtkWeb.NoOp,
            start = function(serverConnection) {
                connection = serverConnection;

                // Create viewport
                viewport = vtkWeb.createViewport({session:connection.session});
                viewport.bind(".viewport-container");

                loading.hide();

                // Handle window resize
                $(window).resize(function() {
                    if(viewport) {
                        viewport.render();
                    }
                }).trigger('resize');

                // Method call at exit time
                stop = function() {
                    if(connection.session) {
                        viewport.unbind();
                        connection.session.call('application.exit');
                        connection.session.close();
                        connection.session = null;
                    }
                };
            };

            function updateView() {
                if(viewport) {
                    viewport.invalidateScene();
                }
            }

            // Not perfect but make sure we get a new image at least every second
            setInterval(updateView, 1000);

            // Launch remote server and connect to it
            vtkWeb.smartConnect(config, start, function(code,reason){
                console.log(reason);
            });
        </script>
    </body>
</html>
